<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
<title>添加用户</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/static/bootstrap-3.3.5-dist/css/bootstrap.css" />

</head>
<body>
	<div class="row-fluid" style="margin-top: 10px;">
		<div class="col-md-6">
		<h3>添加用户</h3>
			<form role="form" class="form-horizontal"
				action="${pageContext.request.contextPath}/updateAdminAction "
				method="post" id="checkForm">
				<div class="form-group">
					<label class="col-md-3 control-label" for="username">用户名</label>
					<div class="col-md-9">
						<input class="form-control" name="bean.username" type="text"
							id="username" placeholder="Username"
							value="${uBean.username }" />
							<input  type="hidden" name="bean.id" id="id" value="${uBean.id }"/>
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-3 control-label" for="inputPassword">密码</label>
					<div class="col-md-9">
						<input type="text" name="bean.password"
							class="form-control" id="inputPassword" placeholder="Password"
							value="${uBean.password }">
					</div>
				</div>
				<div class="form-group">
					<label class="col-md-3 control-label" for="password2">权限</label>
					<div class="col-md-9">
						<select class="form-control" name="bean.power" >
							<option value="0">系统管理员</option>
							<option value="1">应急办工作人员</option>
							<option value="2">地震局工作人员</option>
							<option value="3">气象局工作人员</option>
							<option value="4">海洋局工作人员</option>
						</select>
					</div>
				</div>
				<div class="form-group"></div>
				<div class="form-group">
					<div class="col-md-offset-3 col-md-9">
						<button type="submit" class="btn btn-primary btn-block">
							提交</button>
					</div>
				</div>
				<c:if test="${param.status.equals('1')}">
					<div class="alert alert-success" role="alert">添加成功</div>
				</c:if>
				<c:if test="${param.status.equals('2')}">
					<div class="alert alert-danger" role="alert">该用户已存在</div>
				</c:if>
				<c:if test="${param.status.equals('3')}">
					<div class="alert alert-success" role="alert">成功</div>
				</c:if>
			</form>
		</div>
		<div class="col-md-3"></div>
	</div>
	<script
		src="${pageContext.request.contextPath}/static/js/jquery-1.12.1.js"
		type="text/javascript"></script>
	<script
		src="${pageContext.request.contextPath}/static/bootstrap-3.3.5-dist/js/bootstrap.js"
		type="text/javascript"></script>
	<script
		src="${pageContext.request.contextPath}/static/js/jquery.validate.js"
		type="text/javascript"></script>
	<script
		src="${pageContext.request.contextPath}/static/js/myValidate.js"
		type="text/javascript"></script>
	<script type="text/javascript">
		var MyValidator = function() {
			var handleSubmit = function() {
				$('.form-horizontal')
						.validate(
								{
									errorElement : 'span',
									errorClass : 'help-block',
									focusInvalid : false,
									rules : {
										'userBean.username' : {
											required : true,
											remote : {
												url : "${pageContext.request.contextPath}/checkUsernameAdminAction",
												type : "post",
												data : {
													"username" : function() {
														return $("#username")
																.val();
													}
												}
											}
										},
										'userBean.password' : {
											required : true
										},
										'userBean.cellphone' : {
											required : true,
											isTel : true
										}
									},
									messages : {
										'userBean.username' : {
											required : "请输入用户名",
											remote : "用户名已存在"
										},
										'userBean.password' : {
											required : "请输入密码"
										},
										'userBean.password2' : {
											required : "请输入重复密码",
											equalTo : "两次输入的密码不一致"
										},
										'userBean.cellphone' : {
											required : "请输入手机号码"
										}
									},

									highlight : function(element) {
										$(element).closest('.form-group')
												.addClass('has-error');
									},

									success : function(label) {
										label.closest('.form-group')
												.removeClass('has-error');
										label.remove();
									},

									errorPlacement : function(error, element) {
										element.parent('div').append(error);
									},

									submitHandler : function(form) {
										form.submit();
									}
								});

				$('.form-horizontal input').keypress(function(e) {
					if (e.which == 13) {
						if ($('.form-horizontal').validate().form()) {
							$('.form-horizontal').submit();
						}
						return false;
					}
				});
			};
			return {
				init : function() {
					handleSubmit();
				}
			};

		}();

		MyValidator.init();
	</script>
</body>
</html>